<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="<%=basePath%>" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?=$title?></title>
<link type="text/css" rel="stylesheet" href="<?= base_url();?>css/rtree.css"/>
<style type="text/css">
<!--
body {
	margin:0;
	padding:10px 0;
	font-size:12px;
}
a{
    color:#000000;
    text-decoration:none;
}
a:hover{
    color:#ff0000;
    text-decoration:underline;
}
.treeTitle{
	cursor:pointer;
}
.bgGray{
	background-color:#3399ff;
	color:#ffffff;
}
.btn{border:#002d96 1px solid; padding:4px 4px 2px; font-size:12px; filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#FFFFFF, EndColorStr=#9DBCEA); cursor:pointer; color:black;}
#wrapper{
	width:570px;
	height:340px;
	margin:0 auto;
	overflow:hidden;
}
#content{
    float:left;
	width:570px;
	height:auto;
}
#left{
    float:left;
	width:210px;
	height:314px;
}
#right{
    float:right;
	width:320px;
	height:314px;
	line-height:26px;
	padding:0 10px;
}
#right ul{
    float:left;
	width:100%;
	height:auto;
}
#right li{
    float:left;
	width:100%;
	height:auto;
}
#foot{
    float:left;
    width:100%;
    height:40px;
	text-align:center;
}
-->
</style>
<script type="text/javascript" src="<?= base_url();?>resources/js/rtree.js"></script>
<script type="text/javascript" src="<?= base_url();?>resources/js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="<?= base_url();?>resources/ymPrompt/skin/dmm-green/ymPrompt.css" />
<script type="text/javascript" src="<?= base_url();?>resources/ymPrompt/ymPrompt.js"></script>
</head>

<body>
<div id="wrapper">
    <form name="folderForm" method="post" action="" enctype="multipart/form-data">
    <div id="content">
		<div id="left">
			<div id="main" onselectstart="return false">
			
			</div>
		</div>
		<div id="right" style="display:none"><b>folder detail:</b><br />
		 <?php 
		    echo form_hidden(array('id'=>'folderParentId','name'=>'folderParentId'));
		    echo form_hidden(array('id'=>'folderId','name'=>'folderId'));
		    echo '<table ><tr><td>folder name:</td><td>'.form_input(array('id'=>'folderName','name'=>'folderName','readonly'=>'readonly')).'</td></tr>';
		    echo '<tr><td>folder Idx:</td><td>'.form_input(array('id'=>'folderIdx','name'=>'folderIdx','readonly'=>'readonly')).'</td></tr>';
		    echo '<tr><td>folder desc:</td><td>'.form_input(array('id'=>'folderDesc','name'=>'folderDesc','readonly'=>'readonly')).'</td></tr>';
		    echo '<tr><td>thumb image:</td><td>'.form_upload('thuImage').'</td></tr>';
		    echo '<tr><td></td><td>'.form_submit(array('id'=>'submiFrm','name'=>'submiFrm','value'=>'update','disabled' => 'disabled')).form_reset('resetFrm','reset').'</td></tr></table>';
		 ?>
		</div>
	</div>
	<div id="foot">
	<input type="hidden" id="nowFolder" name="folderId" value="1"/>
	<input name="" type="button" class="btn" onclick="enterNewPage()" value="new" />&nbsp;&nbsp;&nbsp;&nbsp;
	<input name="" type="button" class="btn" onclick="delFolder()" value="delete" />&nbsp;&nbsp;&nbsp;&nbsp;
	<input name="" type="button" class="btn" onclick="updateM(this);" value="update model" /></div>
	</form>
</div>
<script type="text/javascript">
function alterBg(){
	$('.treeTitle').unbind('click').click(function(){
		$('.bgGray').removeClass('bgGray');
		$(this).addClass('bgGray');
	});
}

			var r=new rTree("r");
			r.setNodedbc(true);
			r.setNodehref(true);
			r.setLazy(true);
			r.canAlterbg(true);
			<?php 
			   foreach ($folders as $key => $folder){
			   	  echo "r.add(".$key.",".$folder->getFolderParentId().",'".$folder->getFolderName()."',";
			   	  echo "'".base_url()."resources/images/folderclose.gif','".base_url()."resources/images/folderopen.gif'";
			   	  echo ",'javascript:setNowFolder(".$key.");'";
			   	  echo ");";
			   }
			?>
			    r.startTree();
			    function setNowFolder(folderId){
				    $("#right").removeAttr("style");
				    $("#nowFolder").val(folderId);
				    var data={'folderId':folderId};

				    $.ajax({   
				         type: "POST",  
				          url: "<?= base_url();?>manager/FolderMgr/edit.do",  
				         data: data,  
				     dataType: "json",  
				     complete: function(data){
					        var jsonlist = eval("("+data.responseText+")");
					        for(var i in jsonlist){
                               $("#"+i).val(jsonlist[i]);
							}
					    }  
				     });
				}
				
				function delFolder(){
				  if(!confirm("delete the folder?"))return;
				  
				  var folder=$.trim($("#nowFolder").val());
				  if(folder==""){
				    alert("please select a folder!");
				    return;
				  }else if(folder==1){
					alert("you can not delete the root folder!");
					return;
				  }else{
                    document.folderForm.action="<?= base_url();?>manager/FolderMgr/delete.do";
                    document.folderForm.submit();
				  }
				}
				
				function updateM(ipt){
				  if($.trim(ipt.value).indexOf("read model")==0){
					  ipt.value="update model";
					  $("input[name^='folder']").attr("readonly","readonly");
					  document.folderForm.action="";
					  $("#submiFrm").attr("disabled","disabled");
			      }else{
			    	 ipt.value="read model";
			    	 document.folderForm.action="<?= base_url();?>manager/FolderMgr/doUpdate.do";
			    	 $("#submiFrm").attr("disabled","");
				     $("input[name^='folder']").attr("readonly","");
			      }
				}

				function enterNewPage(){
					var folder=$.trim($("#nowFolder").val());
					  if(folder==""){
						  ymPrompt.win('<?= base_url();?>manager/FolderMgr/news',410,270,'create new folder',close,null,null,true);
					  }else{
						  ymPrompt.win('<?= base_url();?>manager/FolderMgr/news/'+folder,410,270,'create new folder',close,null,null,true);
				      }
				}
			</script>
</body>
</html>
